<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
	<head>
		<meta charset="UTF-8">
		<title>角色管理授权页面</title>
		<link rel="stylesheet" href="resource/css/layui.css">
		<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
		<meta name="renderer" content="webkit" />
		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
		<meta name="apple-mobile-web-app-status-bar-style" content="black" />
		<meta name="apple-mobile-web-app-capable" content="yes" />
		<meta name="format-detection" content="telephone=no" />
		<link rel="stylesheet" href="css/global.css" media="all">
  		<link rel="stylesheet" href="css/font-awesome/css/font-awesome.min.css">
	</head>
	<body>
		<form class="layui-form" style="margin:15px;" >
			<div class="layui-form-item">
				<label class="layui-form-label">菜单列表</label>
				<div class="layui-input-block">
					<ul id="tree" class="ztree"></ul>
				</div>
			</div>
			<div class="layui-form-item">
			    <div class="layui-input-block">
			      <button class="layui-btn" lay-submit lay-filter="edit">确定</button>
			    </div>
			</div>
		</form>
		<script src="resource/layui.js"></script>
		<link rel="stylesheet" href="resource/ztree/metroStyle.css" type="text/css"/>
		<script type="text/javascript" src="resource/ztree/jquery-1.4.4.min.js"></script>
		<script type="text/javascript" src="resource/ztree/jquery.ztree.core.js"></script>
		<script type="text/javascript" src="resource/ztree/jquery.ztree.excheck.js"></script>
		<script src="js/measureRole_authorize.js"></script>
		<script type="text/javascript" th:inline="javascript">
			var tree = $("#tree");
			var zTree;
			var setting = {
			    check: {
			        enable: true,
			        checked : "enable",
		        	chkStyle: "checkbox",
		    		chkboxType: { "Y": "p", "N": "s" }
			    },
			    view: {
			        dblClickExpand: false,
			        showLine: true,
			        showIcon: true,
			        selectedMulti: false
			    },
			    data: {
			        simpleData: {
			        	checked : "enable",
			            enable: true,
			            idKey: "id",
			            pIdKey: "parentId",
			            rootpid: ""
			        },
			        key: {
			            name: "menuName",
			            checked: "enable",
			            children: "chlidMenus"
			        }
			    },
			    callback: {
			    	onCheck : function(e, treeId, treeNode){
			    		$.ajax({
			    			url:"doUpdateRoleMenu",
			    			data:{roleId:getUrlParam("id"),menuId:treeNode.id,checked:treeNode.getCheckStatus().checked},
			    			success:function(res){
			    				
			    			}
			    		})
			    	}
			    }
			};
			/*$.ajax({
			      url: "getListMenu",
			      type: "post",
			      dataType: "json",
			      cache: false,
			      data: {id: getUrlParam("id")},
			      success: function (res){
			          zTree = $.fn.zTree.init(tree, setting, res.data);
			      }
			  });*/
			zTree = $.fn.zTree.init(tree, setting, [[${listMent}]]);
			 
			
			/*$.each([[${listMent}]], function(index, item){
				if(item.enable){
 					var node = zTree.getNodeByParam("id", item.id, null);
					zTree.checkNode(node);
				}
			})*/
		</script>
	</body>
</html>